<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>慢作Worktop | 好东西慢慢作</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="format-detection" content="telephone=no">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link rel="alternate icon" type="image/png" href="../assets/i/favicon.png">
    <link rel="stylesheet" href="../base-component/amazeui/css/amazeui.min.css"/>
    <link rel="stylesheet" href="../base-component/cropper/cropper.min.css"/>
    <link rel="stylesheet" href="../base-component/layui/css/layui.css"/>
    <style>
        .am-edit-width-min {
            min-width: 160px;
            width: 160px;
            max-width: 160px; 
        }
        .am-tab-width-min {
        	min-width: 80px;
        }
        h4{
        	font-weight: bold;
        }
    </style>
</head>
<body style="overflow-y: auto">
<!--title-->
<div class="am-cf am-padding">
    <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">商品分类管理</strong>
    </div>
</div>
<!--列表-->
<div class="am-panel am-panel-secondary">
    <div class="am-panel-hd">
        <h4 class="am-panel-title" data-am-collapse="{parent: '#accordion', target: '#sys-goods-list'}">
            商品分类列表<span class="am-icon-chevron-down am-fr" ></span>
        </h4>
    </div>
    <div id="sys-goods-list" class="am-panel-collapse am-collapse am-in">
        <div class="am-panel-bd">
            <div class="am-g">
                <div class="am-u-sm-12 am-scrollable-horizontal">
                    <table class="am-table am-table-striped am-table-hover am-text-sm">
                        <thead>
                        <tr class="am-table">
                            <th class="am-text-truncate">名称</th>
                            <th class="am-text-truncate">创建时间</th>
                            <th class="am-text-truncate"><button style="margin: 0 auto" class="am-btn am-btn-danger am-btn-xs" id="product-category-add">新增</button></th>
                        </tr>
                        </thead>
                        <tbody id="system-product-category-list-body">
                        </tbody>
                    </table>
                    <div id="sys-product-list-body-page" class="am-fr"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 修改模态窗口 -->
<div class="am-modal-dialog" id="system-product-category-update-model" style="display: none;">
	<div class="am-u-sm-12">
		<form class="am-form" id="sys-product-form-update" data-am-validator>
	        <fieldset>
	            <div class="am-form-group">
	                <label for="name">商品分类名称</label>
	                <input  class="" type="text" class="" id="name" name = "name"  placeholder="请输入分类名称..." required="required">
	            </div>
	            <div class="am-form-group">
	                <label for="englishName">英文名称</label>
	                <input class="" type="text" class="" onKeyUp="value=value.replace(/[\u4E00-\u9FA5]/g,'')" id="englishName" name = "englishName" placeholder="请输入英文名称..." required="required">
	                <span class="am-form-caret"></span>
	            </div>
	            <div class="am-form-group am-form-file">
	                <label for="categoryImg">分类图片</label>
	                <div style="height: 100px; line-height: 100px;">
	                    <img flagImg="" id="categoryImg" class="" alt="分类图片展示" src="" width="100"/>
	                </div>
                    <input type="hidden" value="" id="productCategoryId" >
	            </div>
                <div class="am-form-group am-form-file">
                    <button type="button" class="am-btn am-btn-default am-btn-sm">
                        <i class="am-icon-cloud-upload"></i> 上传图片(小于20K)
                    </button>
                    <input type="file" id="productFileImg" multiple>
                </div>
       			<p>
             	   <button type="button" id="save" class="am-btn am-btn-primary">保存</button>
	            </p> 
	        </fieldset>
	    </form>
    </div>
</div>
<!--list模版-->
<script id="systemProductCategoryListTpl" type="text/html">
    {{#  layui.each(d.msg, function(index, item){ }}
    <tr>
        <td class="am-text-truncate am-tab-width-min">{{ item.name }}</td>
        <td class="am-text-truncate am-tab-width-min">{{ item.createDate }}</td>
        <td class="am-text-truncate am-edit-width-min">
            <div class="am-btn-group am-btn-group-xs">
                <input type="button" class="am-btn am-btn-primary btn-system-product-category-update" id="{{ item.id }}" value="编辑">
                {{# if(item.orders === 0){ }}
                <input type="button" class="am-btn am-btn-default btn-sys-product-states enable" id="{{ item.id }}" value="禁用">
                {{# } }}
                {{# if(item.orders === 1){ }}
                <input type="button" class="am-btn am-btn-success btn-sys-product-states enable" id="{{ item.id }}" value="启用">
                {{# } }}

            </div>
        </td>
    </tr>
    {{#  }); }}
</script>
<!--js-->
<script src="../base-component/jquery/jquery.min.js"></script>
<script src="../base-component/amazeui/js/amazeui.min.js"></script>
<script src="../assets/js/api.js"></script>
<script src="../base-component/layer/layer.js"></script>
<script src="../base-component/layui/layui.js"></script>
<script src="../base-component/cropper/cropper.min.js"></script>
<script src="../assets/js/system-product-category.js"></script>
</body>
</html>